<template>
    <div>
        <span class="m-shadow" @click="closePaytype"></span>
        <div class="m-type-div">
            <p>支付方式</p>
            <ul>
                <li @click="wxpayEvent">微信支付</li>
                <li @click="closePaytype">取消</li>
            </ul>
        </div>
    </div>
</template>
<script>
import {wxPay} from '@/api/views';
export default {
    name:'',
    props:['CardClassId','price'],
    data () {
        return {

        }
    },
    methods: {
        // 取消
        closePaytype(){
            this.$emit('closePaytype');
        },
        // 微信支付
        wxpayEvent() {
            let that = this;
            let CardClassId = this.CardClassId;
            let param = {
                openid:'oavnv0xp3G8CWXECVelORjVg5Hw0',
                customer_id:'0091001709',
                quantity:1,
                price:this.price,
                CardClassId:CardClassId
            }
            wxPay(param).then((result) => {
                WeixinJSBridge.invoke(
                    'getBrandWCPayRequest', result.data,
                    function(res) {
                        // WeixinJSBridge.log(res.err_msg);
                        if (res.err_msg == 'get_brand_wcpay_request:ok') {
                            //- 支付成功
                            
                        } else if (res.err_msg == 'get_brand_wcpay_request:cancel') {
                            // 取消支付
                            

                        } else {
                            $.confirm('支付失败!');
                        }
                    }
                );
            }).catch((err) => {
                that.$messagebox.confirm('支付失败').then(action=>{

                })
            });
            this.$emit('closePaytype');
        },
    }
}
</script>
<style lang="less" scoped>
.m-type-div{
    position: fixed;
    bottom: 0;
    left: 0; right: 0;
    z-index: 3;
    background: white;
    border-radius: 6px 6px 0 0;
    padding: 0 0.8rem;
    text-align: center;
    line-height: 3rem;
    p{
        color: @light-gray;
        font-size: .8rem;
    }
    li{
        border-top: 1px solid @background-gray;
    }
}
</style>
